<template>
  <div class="my-data">
    <NavBar :title="title" />
    <div class="content-top">
      <MyEmpty v-if="loading === false && list.length === 0" />
      <van-list v-model="loading" :finished="!loading" @load="onLoad" v-else>
        <van-swipe-cell class="list-item" v-for="(item, index) in list" :key="index">
          <div class="item-show" @click="onJobClick(item.stationID)">
            <p>
              <span>{{ item.stationName }}</span>
              <span>{{ $dayjs(item.collectDate).format("MM-DD") }}</span>
            </p>
            <p>
              <span>{{ item.companyName }}</span>
            </p>
          </div>
          <template #right>
            <van-button square text="删除" type="danger" style="height: 100%" @click="onDel(index, item.id)" />
          </template>
        </van-swipe-cell>
      </van-list>
    </div>
  </div>
</template>

<script>
import NavBar from "@/components/NavBar.vue";
import MyEmpty from "@/components/MyEmpty.vue";
import { List, Toast, Dialog, SwipeCell, Button } from "vant";
import { mixin_person_toJobCompany } from "@/mixin/mixins";
export default {
  name: "CollectJob",
  components: {
    NavBar,
    MyEmpty,
    [List.name]: List,
    [SwipeCell.name]: SwipeCell,
    [Button.name]: Button,
  },
  props: ["title"],
  mixins: [mixin_person_toJobCompany],
  activated() {
    this.onLoad();
  },
  // 定义属性
  data() {
    return {
      list: [],
      loading: true,
    };
  },
  // 方法集合
  methods: {
    async onLoad() {
      this.loading = true;
      await this.$api.get('/PersonStation/GetCollectStationPageList', { pageIndex: 1, pageSize: 100 }).then(res => {
        if (res.success) {
          this.loading = false;
          this.list = res.response;
        }
      })
    },
    onDel(index, id) {
      Dialog.confirm({ message: "确认删除该职位？", }).then(() => {
        this.$api.get('/PersonStation/CollectStation', { stationID: id, flag: 0 }).then(res => {
          if (res.success) {
            Toast.success('删除成功');
            this.list.splice(index, 1);
          }
          else { Toast.fail(res.msg) }
        })
      })
    },
  },
};
</script>

<style lang="less">
@import "vant/lib/dialog/index.less";
@import "@/assets/css/common.less";
@import "@/assets/css/person-my-job-list.css";
</style>
